<!DOCTYPE html>
<html xmlns:v-bind="http://www.w3.org/1999/xhtml">
	<head>
		<meta charset="utf-8" lang="zh_CN">
		<title>个人学习笔记网-首页</title>
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<!-- 引入 Bootstrap -->
		<link rel="stylesheet" href="../css/bootstrap.min.css" />
		<link rel="stylesheet" href="../css/style.css" />
		<!-- HTML5 Shim 和 Respond.js 用于让 IE8 支持 HTML5元素和媒体查询 -->
		<!-- 注意： 如果通过 file://  引入 Respond.js 文件，则该文件无法起效果 -->
		<!--[if lt IE 9]>
		<script type="text/javascript" src="../js/html5shiv.js" ></script>
		<script type="text/javascript" src="../js/respond.min.js" ></script>
      	<![endif]-->
		<link rel="stylesheet" href="../css/font-awesome.min.css"/>
	</head>

	<body>
		<div class="container" id="app">
			<div class="row" style="margin-bottom: -15px">
				<a href="#top" id="toTop"></a>
				<nav class="navbar navbar-inverse" role="navigation">
					<div class="navbar-header">
						<a class="navbar-brand" href="#">个人学习笔记网</a>
					</div>
					<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
						<ul class="nav navbar-nav">
							<li>
								<a href="../index.html">首页</a>
							</li>
							<li>
								<a href="../static/index.html">新建笔记</a>
							</li>
							<li class="active">
								<a href="#">全部分类</a>
							</li>
							<li>
								<a href="search.html">高级搜索</a>
							</li>
						</ul>
						<form class="navbar-form navbar-left" action="index.html" role="search">
							<div class="form-group">
								<input type="text" name="wd" class="form-control" placeholder="搜索笔记..." />
							</div> <button type="submit" class="btn btn-default">搜索</button>
						</form>
						<ul class="nav navbar-nav navbar-right">
							<li>
								<a href="javascript:nav_show();">网站导航</a>
							</li>
						</ul>
					</div>
				</nav>
			</div><!--The Header End-->
			<script>
                var nav_show = function () {
                    qiao.bs.dialog({
                        id : 'nav_index',
                        url :'../public/nav.htm',
                        head:false,
                        foot:false,
                        backdrop: true,
                        big : true
                    },function () {
                        return true;
                    });
                }
			</script>
			<div class="row">
				<div class="box box-primary">
					<div class="box-header">
						<h3 class="box-title">全部分类</h3>
						<div class="box-tools">
							<div class="input-group input-group-sm" style="width: 150px;">
								<input type="text" name="table_search" v-model="typename"
									   class="form-control pull-right"
									   placeholder="本页搜索">

								<div class="input-group-btn">
									<button type="submit" class="btn btn-default"><i class="fa fa-search"></i></button>
								</div>
							</div>
						</div>
					</div>
					<!-- /.box-header -->
					<div class="box-body">
						<div style="margin-bottom: 20px;" v-for="(type,index) in types" v-if="checkType(type.next,typename)" >
							<label>{{type.name}}</label><br>
							<span v-for="item in type.next" v-if="checkName(item.typename,typename)">
							<a class="btn btn-default a-btn" target="_blank"
							   v-bind:href="'list.html?cid='+item.id+'&typename='+encodeURIComponent(item.typename)" >
								{{item.typename}}</a>
							</span>
						</div>

					</div>
					<!-- /.box-body -->
				</div>
				<!-- /.box -->
			</div>

			<div class="row">
				<div class="col-md-12 text-center footer">
					<span class="common">
		 	Copyright &copy;2017 湖南城市学院  
		 	<a class="common" href="http://www.hncu.net" target="_blank">hncu.net</a> 
		 	All Rights Reserved.
		 </span>
				</div>
			</div>
		</div>
		<!--主内容区域结束-->
	</body>
	<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
	<script type="text/javascript" src="../js/jquery.min.js"></script>
	<!-- 包括所有已编译的插件 -->
	<script type="text/javascript" src="../js/bootstrap.min.js"></script>
	<script src="../js/jquery.scrollToTop.min.js"></script>
	<script src="../js/qiao.js"></script>
	<script src="../js/moment.min.js"></script>
	<script src="../js/verify.js"></script>
	<script src="../js/vuejs/vue.min.js"></script>
	<script>
		$(function () {
			getMainType(function () {
				$.each(data.main,function () {

                })
            });
        });

		var getMainType = function (id,callback) {
            $.ajax({
                type:'post',
                url:'getMainType',
                data:null,
                success:function (result) {
                    $.each(result,function (index) {
                       getChildType(this.id,this.typename);
                    });
                },
                complete:function () {
					if(typeof callback === "function"){
					    callback();
					}
                }
            });
        }

        var getChildType = function (id,name,callback) {
            $.ajax({
                type:'post',
                url:'getChildType',
                data:{mid:id},
                success:function (result) {
                    	var tmp = {name:name,next:result};
                        data.types.push(tmp);
                },
                complete:function () {
                    if(typeof callback === "function"){
                        callback();
                    }
                }
            });
        }

		$("#toTop").scrollToTop(800);
		var data = {
			types: [],
			typename: ''
		}
		var vue = new Vue({
			el: '#app',
			data: data,
			methods: {
				checkName: function(dt,name) {
					if(name.length === 0) {
						return true;
					}
					var myReg;
                    name = replaceSpecialChar(name);
					eval("var myReg = /" + name + "/ig;");
					if(myReg.test(dt))
						return true;
					return false;
				},
                checkType:function (next,name) {
                    if(next.length == 0){
                        return false;
                    }
                    if(name.length === 0) {
                        return true;
                    }
					var tag = false;
				    var myReg;
				    name = replaceSpecialChar(name);
                    eval("var myReg = /" + name + "/ig;");
				    $.each(next,function (index) {
                        if(myReg.test(this.typename)){
                            tag = true;
                            return false;
                        }
                    })
					if(tag) return true;
					else return false;
                }
			},
			filters: {
				filterByName: function(dt, name) {
					if(!dt || dt == '' || dt == 0) {
						return '';
					}
					var name = name || '';
					if(name.length == 0) {
						return dt;
					}
					//var re = /\d{4}-\d{2}$/;
					//eval("var re = /\\d{4}" + splitChar + "\\d{2}$/;"); 
					//pattern1   =   new   RegExp( "\\w+\\ "+n[i]+ "$ ", "gi "); 
					//var myReg = /name/ig;
					eval("var myReg = /" + name + "/ig;");
					if(myReg.test(dt))
						return dt;
					return '';
				},
			}
		});
	</script>

</html>